Вход

Просмотр полной версии : Динамическое свертывание/развертывание текста

undef
31.03.2009, 03:53
Здравствуйте!
Чуствую что забуксовал совсем. Нужен скрипт который сможет скрывает/отображает текст при нажатии на линк с анимацией (View more/ View less).
Прикол в том, что текст может прерыватся на середине строчки. Kогда юзер нажимает линк, с того места где прервался текст он должен продолжится.
Эффект accordion. Только проблема в том что те примеры которые я нашел они работают с div элементами. А мне надо со span.

Спасибо.
AzriMan
31.03.2009, 09:46
писать за вас код никто не станет. вы можете предложить свою вариант скрипта с указанием ошибки, возникающей в процессе отладки. в таком случае шанс получить помощь велика. а делать за вас готовый код никто не будет.
p.s. да, и поиск никто не отменял:
http://javascript.ru/forum/dom-window/3207-pomogite-so-skriptom-svorachivaniya-teksta.html

p.p.s. да, и еще. вы, наверное, не в курсе происходящих событий, но последних телепатов из нашего штата забрали силы Пси-Корпуса. руководство данного ресурса пыталось договориться с Альфредом Бестером о том, что бы оставить нам хоть одного сотрудника-телепата, но достигнуть консенсуса нам не удалось. таким образом, догадаться, что конкретно у вас не получается со `span`-тегами - мы не сможем.
undef
01.04.2009, 14:38
Вот собственно и код который не работает.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>


<title>Untitled Page</title>

<script src="/Edit/Js/jquery-1.2.6.js" type="text/javascript"></script>

<script type="text/jscript">
$("#moreLink").click(function(){
$("#more").animate({
width : "auto",
height : "auto",
display : ""
}, 1500 );
});

$("#lessLink").click(function(){
$("#more").animate({
width : 0,
height : 0,
display : "none"
}, 1500 );
});


</script>
</head>
<body>
<div style="width:200px;">

<p id="text">
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industrys standard dummy text ever since the 1500s,
when an unknown printer took a galley of type and scrambled it to make a type specimen book.
<a id="moreLink" href="#" >View more</a>
<span id="more" style="display:none;">
It has survived not only five centuries, but also the leap into electronic typesetting,
remaining essentially unchanged. It was popularised in the 1960s with the release of
Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing
software like Aldus PageMaker including versions of Lorem Ipsum.<a id="lessLink" href="#" >View less</a>
</span>

</p>
</div>

</body>
</html>


Спасибо.

п.с. Пошлите это по мылу "сотруднику-телепату" он поймет...
AzriMan
02.04.2009, 11:52
с синтаксисом JQuery не знаком. но, интуитивно, вроде должно работать.
т.е. вы хотите сказать, что для тегов div этот код работает, а для span - нет?
x-yuri
03.04.2009, 03:57
1) где ты взял text/jscript?
2) вставь в начало скрипта alert($('#moreLink').length) и подумай, о чем говорит результат
undef
03.04.2009, 10:26
Честно говоря намек не понял...
этот alert($('#moreLink').length) - возвращает 0.
Правда кому интересна эта велечина линка я даже не знаю.

Спасибо.
Kolyaj
03.04.2009, 10:31
Честно говоря намек не понял...
этот alert($('#moreLink').length) - возвращает 0.
Правда кому интересна эта велечина линка я даже не знаю.
Отсутствие самостоятельного мышления это плохо. 0 говорит о том, что ни один элемент с id moreLink не найден. Почему догадаетесь, или дальше объяснять?
undef
03.04.2009, 11:25
Отсутствие самостоятельного мышления это плохо - согласен с Вами.
Не могли бы Вы подсказать как обратится к эл. #moreLink.

п.с. Теперь становится понятным почему этот форум нуждается в телепатах.
Kolyaj
03.04.2009, 11:32
undef,
видите ли, просто рассказывать вам решение проблемы неинтересно и непродуктивно, вы потом каждый день с подобными вопросами прибегать будете.

Не могли бы Вы подсказать как обратится к эл. #moreLink.
Вы обращаетесь к нему, когда его еще не существует.